93:I[903690,["/chat-static/_next/static/chunks/2ny0f3_zeefg8.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0c34czz85xh3f.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3ot6wcd5ecpln.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1c4pf12npy4a_.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2j46pilgqkinh.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3wiwg53adn758.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2b2k-zf-b56kd.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0l5nai4znivqy.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/35cffbjvsl8sh.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3abf52lxefhni.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1qn4-ha2vsd-p.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/095lel5ufcr08.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0zgz5up_moiwf.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2cv_oykzmlqpk.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2eq_3tgsc9fan.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3u5f5fge21f5p.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2cbmnugpvavl4.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3-5v2zikwtdtn.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/09z6ri07r3sma.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/420uifudym9av.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/04dkbwvbkscb6.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/194j0nolabgr9.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1fvo0xwkj8x_o.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3z-fk_6xzfhai.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/37xbvek5lee4t.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0-9zq73z_eohn.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1axcumexuksf-.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2iwiq6nmum4w5.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3bu_pn69_2ac_.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1lb6na2ocrfl4.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1zjw9h8eodvzb.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0rr17y2zzppmc.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2avjef50dmojk.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1_kx0_cln4rnk.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/337wrk72tvyil.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1ks0r-j8ozfdw.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3fqvzp2yqv6c9.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1a7v266ajms1f.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3pwc98sa29io0.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6"],"ExplicitChatIdProvider"] 94:I[838238,["/chat-static/_next/static/chunks/2ny0f3_zeefg8.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0c34czz85xh3f.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3ot6wcd5ecpln.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1c4pf12npy4a_.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2j46pilgqkinh.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3wiwg53adn758.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2b2k-zf-b56kd.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0l5nai4znivqy.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/35cffbjvsl8sh.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3abf52lxefhni.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1qn4-ha2vsd-p.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/095lel5ufcr08.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1rz_9ckgsy-eb.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0zgz5up_moiwf.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2cv_oykzmlqpk.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2eq_3tgsc9fan.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3u5f5fge21f5p.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3nl30ufs08xyt.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2cbmnugpvavl4.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3-5v2zikwtdtn.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/09z6ri07r3sma.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/11e80b-y89mrs.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/420uifudym9av.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/04dkbwvbkscb6.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/194j0nolabgr9.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1fvo0xwkj8x_o.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3z-fk_6xzfhai.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/37xbvek5lee4t.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0-9zq73z_eohn.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1axcumexuksf-.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2iwiq6nmum4w5.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3bu_pn69_2ac_.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1lb6na2ocrfl4.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1zjw9h8eodvzb.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/0rr17y2zzppmc.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/2avjef50dmojk.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1_kx0_cln4rnk.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/337wrk72tvyil.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1ks0r-j8ozfdw.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3fqvzp2yqv6c9.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/1a7v266ajms1f.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6","/chat-static/_next/static/chunks/3pwc98sa29io0.js?dpl=dpl_F6fGdtRkhKtVZAN4AcSEoy23cve6"],"SWRDataProvider"] 95:T1082,[V0_FILE]typescriptreact:file="cuisine-selector.tsx" isQuickEdit="true" "use client" import { useState } from "react" import { motion, AnimatePresence } from "framer-motion" import { Check } from 'lucide-react' const cuisines = [ "Mexican", "Italian", "Chinese", "Japanese", "Indian", "Greek", "French", "Spanish", "Turkish", "Lebanese", "Vietnamese", "Korean", "Argentinian", "Peruvian", "Ethiopian", "Nigerian", "German", "British", "Irish", "Swedish", "Danish", "Polish", "Hungarian", "Portuguese", ] const transitionProps = { type: "spring", stiffness: 500, damping: 30, mass: 0.5, } export default function CuisineSelector() { const [selected, setSelected] = useState([]) const toggleCuisine = (cuisine: string) => { setSelected((prev) => prev.includes(cuisine) ? prev.filter((c) => c !== cuisine) : [...prev, cuisine] ) } return (

What are your favorite cuisines?

{cuisines.map((cuisine) => { const isSelected = selected.includes(cuisine) return ( toggleCuisine(cuisine)} layout initial={false} animate={{ backgroundColor: isSelected ? "#2a1711" : "rgba(39, 39, 42, 0.5)", }} whileHover={{ backgroundColor: isSelected ? "#2a1711" : "rgba(39, 39, 42, 0.8)", }} whileTap={{ backgroundColor: isSelected ? "#1f1209" : "rgba(39, 39, 42, 0.9)", }} transition={{ type: "spring", stiffness: 500, damping: 30, mass: 0.5, backgroundColor: { duration: 0.1 }, }} className={` inline-flex items-center px-4 py-2 rounded-full text-base font-medium whitespace-nowrap overflow-hidden ring-1 ring-inset ${isSelected ? "text-[#ff9066] ring-[hsla(0,0%,100%,0.12)]" : "text-zinc-400 ring-[hsla(0,0%,100%,0.06)]"} `} > {cuisine} {isSelected && (

)} ) })}

) } 89:["$","$L93",null,{"chatId":"3g3Z4cT4Uxj","children":["$","$L94",null,{"data":{"@\"active-block\",\"3g3Z4cT4Uxj\",":{"id":"xj6wKCr8Ays","messageId":"j3PklJxmI3rDhMWR0YIh4sdMpfb2Bla1","source":"$95","language":"typescriptreact","type":"code-project","closed":true,"meta":{"id":"cuisine-selector","type":"code-project","project":"cuisine-selector"},"hasSourceBeenEdited":false,"forkedFromBlockId":"$undefined"},"@\"chat:vm-mode\",\"3g3Z4cT4Uxj\",":false,"":null},"children":"$L96"}]}]

About

Tags

Share

About

Tags

Share

More from yadwinder

More Templates Like This